export default {
  //容器的样式
  contentStyle : computed(() => {
    let frs = [];
    for (let i = 0; i < store.state.form.col; i++) {
      frs.push("1fr");
    }
    return {
      height: document.documentElement.clientHeight - 50 + "px",
      backgroundColor:
        useOsTheme().value == "dark"
          ? "rgba(255,255,255,0.1)"
          : "rgba(0,0,0,0.1)",
      position: "relative",
      display: "grid",
      padding: "10px",
      gridTemplateColumns: frs.join(" "),
      gridTemplateRows: "repeat(auto-fit, 100px)",
      gridGap: "10px",
      overflow: "auto",
    };
  }),
  /**
   * 根据item返回该组件的grid样式
   * @param {*} item 
   * @returns 
   */
  gridStyle : (item) => {
    let style = {};
    if (item.widget.row) {
      style = {
        gridCol: "span " + item.widget.col || 1,
        gridRow: "span " + item.widget.row || 1,
        position: "relative",
        gridAutoFlow: "dense",
      };
    } else {
      style = {};
    }
    if (item.id == current.value.id) {
      style.backgroundColor = "rgba(99, 226, 183,0.3)";
    }
    return style;
  }
}